﻿@page "/toggles"
@inject IStringLocalizer<Toggles> Localizer

<h3>@Localizer["Title"]</h3>

<h4>@Localizer["SubTitle"]</h4>

<DemoBlock Title="@Localizer["BasicUsageTitle"]" Introduction="@Localizer["BasicUsageIntro"]" Name="Normal">
    <p>@Localizer["BasicUsageP"]</p>
    <div class="row g-3">
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="@BindValue" ValueChanged="@OnValueChanged" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Primary" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Secondary" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Success" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Danger" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Warning" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Info" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Dark" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle Value="false" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Success" />
        </div>
    </div>
    <BlockLogger @ref="Trace" class="mt-3" />
</DemoBlock>

<DemoBlock Title="@Localizer["DisableTitle"]" Introduction="@Localizer["DisableIntro"]" Name="Disable">
    <div class="row g-3">
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Primary" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Secondary" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Success" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Danger" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Warning" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Info" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="true" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Dark" />
        </div>
        <div class="col-6 col-sm-4 col-md-3 col-lg-auto">
            <Toggle IsDisabled="true" Value="false" OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" Color="Color.Success" />
        </div>
    </div>
</DemoBlock>

<DemoBlock Title="@Localizer["BindToWayTitle"]" Introduction="@Localizer["BindToWayIntro"]" Name="BindToWay">
    <p>@((MarkupString)Localizer["BindToWayP1"].Value)</p>
    <div class="row g-3">
        <div class="col-12">
            <Toggle OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" @bind-Value="@Model.BindValue" DisplayText="@Localizer["BindToWayDiaspalyText1"]" />
        </div>
        <div class="col-12">
            <div>@Localizer["BindToWayDiv"] @Model.BindValue</div>
        </div>
        <Divider Text="@Localizer["CustomLabelText"]" />
        <div class="col-12">
            <p>@((MarkupString)Localizer["BindToWayP2"].Value)</p>
        </div>
        <div class="col-12">
            <Toggle OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" @bind-Value="@Model.BindValue" DisplayText="@Localizer["CustomLabelText"]" ShowLabel="true" />
        </div>
        <Divider Text="@Localizer["OccupantsText"]" />
        <div class="col-12">
            <p>@((MarkupString)Localizer["BindToWayP3"].Value)</p>
        </div>
        <div class="col-12">
            <Toggle OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" @bind-Value="@Model.BindValue" ShowLabel="true" />
        </div>
        <Divider Text="@Localizer["NotOccupantsText"]" />
        <div class="col-12">
            <p>@((MarkupString)Localizer["BindToWayP4"].Value)</p>
        </div>
        <div class="col-12">
            <Toggle OnText="@Localizer["OnText"]" OffText="@Localizer["OffText"]" @bind-Value="@Model.BindValue" DisplayText="@Localizer["NotDisplayText"]" ShowLabel="false" />
        </div>
    </div>
</DemoBlock>

<AttributeTable Items="@GetAttributes()" />

<EventTable Items="@GetEvents()" />
